<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%String root = request.getContextPath(); %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Blog -- Diary</title>
<link rel="stylesheet" href="<%=root %>/css/photoHead.css"/>
<script src="<%=root %>/js/photoFamily.js"></script>
</head>
<body>

<div id="head">
      <div id="warp">
          <ul>
              <li><img src="<%=root %>/images/photo1.jpg"> </li>
              <li><img src="<%=root %>/images/photo2.jpg"></li>
              <li><img src="<%=root %>/images/photo3.jpg"></li>
              <li><img src="<%=root %>/images/photo4.jpg"></li>
          </ul>
      </div>
      <div id="menu">
         <ul>
             <!--<li id="theme"><a href="bologTheme.html">首页</a></li>
             <li id="journey"><a href="journey.html">日志</a></li>
             <li id="picture"><a href="photoFamily.html">相册</a></li>
             <li id="person"><a href="personnel_introduce.html">个人</a></li>-->
             
             <!--采用面向对象方法创建选项卡-->
         </ul>
      </div>
</div>
<div id="main">
      <div class="box">
        <div class="pic">
            <img src="<%=root %>/images/0.jpg"/>
        </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/1.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/2.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/3.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/4.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/5.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/6.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/7.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/8.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/9.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/10.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/11.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/12.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/13.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/14.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/15.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/16.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/17.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/18.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/19.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/20.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/21.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/22.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/23.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/24.jpg"/>
          </div>
      </div>
       <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/25.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/26.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/27.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/28.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/29.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/30.jpg"/>
          </div>
      </div>
      <div class="box">
          <div class="pic">
              <img src="<%=root %>/images/31.jpg"/>
          </div>
      </div>
      
</div>

</body>
</html>